@charset "utf-8";
@component-namespace t {
  @b progress-bar {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    @e title {
      position: relative;
      width: 35%;
      height: 0.85rem;
      margin-right: 5%;
      font-size: var(--assist-font-size-mini);
      display: flex;
      align-items: center;
      justify-content: center;
      color: white;
    }
    @e wrapper {
      overflow: hidden;
      position: relative;
      width: 65%;
      height: 0.65rem;
      border: 0.05rem solid var(--color-light-silver);
      border-radius: 0.5rem;
      @m primary {
        border-color: var(--color-primary);
      }
      @m success {
        border-color: var(--color-success);
      }
    }
    @e inner {
      width: 0%;
      height: 100%;
      border-radius: 0.5rem;
      @m primary {
        background-color: var(--color-primary);
      }
      @m success {
        background-color: var(--color-success);
      }
    }
    @e text {
      position: absolute;
      left: -1px;
      right: -1px;
      top: -1px;
      bottom: -1px;
      width: 80%;
      margin: auto;
      display: flex;
      align-items: center;
      justify-content: center;
      @e title {
        color: white;
        font-size: var(--assist-font-size-mini); 
      }
    }
  }
}